<template>
	<view class="content">
		<!-- #ifdef MP-WEIXIN -->
		<f-navbar bgColor="#12ae85" :navbarType="5" fontColor="#fff" transparentTitleColor="#000" :isShowLeft="false"
			:scrollTop="scrollTop" title="我的" :isShowTransparentTitle="false"></f-navbar>
		<!-- #endif -->
		<view class="header">
			<image class="bg" src="../../static/kp/user-bg.png"></image>
			<view class="header-info">
				<view class="userinfo" @click="toLogin">
					<view class="face">
						<image :src="userInfo.avatar || '/static/img/default.png'"></image>
					</view>
					<view class="info info-row" v-if="hasLogin">
						<view>
							<view class="info-top">
								<view class="username">{{ userInfo.realname }}</view>
							</view>
							<view
								v-if="ifPermission('info-user') || ifPermission('info-planer') || ifPermission('info-parent')|| ifPermission('info-teacher')">
								<text class="integral" v-if="userInfo.phone">
									{{ hidePhone(userInfo.phone) }}
								</text>
								<text class="integral" v-else @click.stop="bindPhone">未绑定手机号</text>
								<text v-if="ifPermission('info-user')" @click.stop="toResume"
									class="percent">简历完善度{{userInfo.percentage}}%</text>
							</view>
							<view v-if="ifPermission('info-company')">
								<text class="integral">{{ userInfo.company }} . {{ userInfo.postName}}</text>
							</view>
						</view>
						<!-- <view class="role" >
							<text class="role-name">{{userInfo.memberRoleName}}</text>
							<text class="yzb yzb-xiala"></text>
						</view> -->
						<text class="role yzb yzb-next"></text>
					</view>
					<view class="info info-column" v-else>
						<view class="username">未登录/注册</view>
						<view>
							<text class="integral">点击可登录/注册</text>
						</view>
					</view>
				</view>
			</view>
			<view class="vip" v-if="userInfo.vipLevel>0" @click="toVip">
				<view class="vip-left">
					<view class="vip-info">
						<image src="../../static/kp/pic_vip.png"></image>
						<text class="info1" v-if="userInfo.vipLevel==1">黄金会员</text>
						<text class="info1" v-else-if="userInfo.vipLevel==2">铂金会员</text>
						<text class="info1" v-else-if="userInfo.vipLevel==3">钻石会员</text>
						<text class="info1" v-else-if="userInfo.vipLevel==4">钛金会员</text>
					</view>
				</view>
				<view class="vip-right2">
					<text>{{formatCreateTime(userInfo.vipEndTime)}}到期</text>
				</view>
			</view>
			<view class="vip" v-else>
				<view class="vip-left">
					<view class="vip-info">
						<image src="../../static/kp/pic_vip.png"></image>
						<!-- <text class="info1">要找好工作，就上人才直聘</text> -->
						<text class="info1">开通会员 · 享更多权益</text>
						<!-- <text class="info2">享更多权益</text> -->
					</view>
					<text class="tips">推送认证企业 · 推送高薪工作 </text>
				</view>
				<view class="vip-right" @click="toVip">
					<text>立即开通</text>
				</view>
			</view>

		</view>
		<view class="w-list" v-if="ifPermission('info-company')">
			<text class="title">我的功能</text>
			<view class="grid" :column="4" :showBorder="false" :square="true">
				<view class="item" v-for="(item, index) in gridList2" @click.native="tapGrid2(item)" :key="index">
					<text class="grid-icon yzb" :class="item.icon"></text>
					<text class="text">{{ item.text }}</text>
					<view v-if="item.badge" class="grid-dot"><uni-badge :text="item.badge" :type="item.type" /></view>
				</view>
			</view>
		</view>
		<view class="w-list" v-if="!hasLogin || ifPermission('info-user')">
			<text class="title">我的功能</text>
			<view class="grid" :column="4" :showBorder="false" :square="true">
				<view class="item" v-for="(item, index) in gridList" @click.native="tapGrid(item)" :key="index">
					<text class="grid-icon yzb" :class="item.icon"></text>
					<!-- <image class="grid-icon2" :src="item.icon"></image> -->
					<text class="text">{{ item.text }}</text>
					<view v-if="item.badge" class="grid-dot"><uni-badge :text="item.badge" :type="item.type" /></view>
				</view>
			</view>
		</view>

		<view class="list" v-if="!hasLogin || ifPermission('info-user')" v-for="(list, list_i) in severList"
			:key="list_i">
			<text class="title">{{list_i==0?'常用功能':'其他功能'}}</text>
			<view class="li" v-for="(li, li_i) in list" @tap="toPage(list_i, li_i)"
				v-bind:class="{ noborder: li_i == list.length - 1 }" hover-class="hover" :key="li.name">
				<view class="left">
					<view class="icons">
						<!-- <text class="yzb" :class="li.icon" :style="{ color: li.color }"></text> -->
						<image :src="li.icon"></image>
					</view>
					<view class="text">{{ li.name }}</view>
				</view>
				<text class="yzb yzb-next icon-next"></text>
			</view>
		</view>
		<view class="list" v-if="ifPermission('info-company')" v-for="(list, list_i) in severList2" :key="list_i">
			<text class="title">{{list_i==0?'常用功能':'其他功能'}}</text>
			<view class="li" v-for="(li, li_i) in list" @tap="toPage2(list_i, li_i)"
				v-bind:class="{ noborder: li_i == list.length - 1 }" hover-class="hover" :key="li.name">
				<view class="left">
					<view class="icons">
						<!-- <text class="yzb" :class="li.icon" :style="{ color: li.color }"></text> -->
						<image :src="li.icon"></image>
					</view>
					<view class="text">{{ li.name }}</view>
				</view>
				<view class="right">
					<text class="auth-result" :class="authState == '已认证' ? 'auth-success' : ''"
						v-if="li.name == '公司认证'">{{ authState }}</text>
					<text class="yzb yzb-next icon-next"></text>
				</view>
			</view>
		</view>
		<view class="list" v-if="ifPermission('info-planer')" v-for="(list, list_i) in severList3" :key="list_i">
			<text class="title">{{list_i==0?'常用功能':'其他功能'}}</text>
			<view class="li" v-for="(li, li_i) in list" @tap="toPage3(list_i, li_i)"
				v-bind:class="{ noborder: li_i == list.length - 1 }" hover-class="hover" :key="li.name">
				<view class="left">
					<view class="icons">
						<image :src="li.icon"></image>
					</view>
					<view class="text">{{ li.name }}</view>
				</view>
				<view class="right">
					<text class="auth-result" :class="authState == '已认证' ? 'auth-success' : ''"
						v-if="li.name == '资料认证'">{{ authState }}</text>
					<text class="yzb yzb-next icon-next"></text>
				</view>
			</view>
		</view>
		<view class="list" v-if="ifPermission('info-parent')" v-for="(list, list_i) in severList4" :key="list_i">
			<text class="title">{{list_i==0?'常用功能':'其他功能'}}</text>
			<view class="li" v-for="(li, li_i) in list" @tap="toPage4(list_i, li_i)"
				v-bind:class="{ noborder: li_i == list.length - 1 }" hover-class="hover" :key="li.name">
				<view class="left">
					<view class="icons">
						<image :src="li.icon"></image>
					</view>
					<view class="text">{{ li.name }}</view>
				</view>
				<text class="yzb yzb-next icon-next"></text>
			</view>
		</view>
		<view class="list" v-if="ifPermission('info-teacher')" v-for="(list, list_i) in severList5" :key="list_i">
			<text class="title">{{list_i==0?'常用功能':'其他功能'}}</text>
			<view class="li" v-for="(li, li_i) in list" @tap="toPage5(list_i, li_i)"
				v-bind:class="{ noborder: li_i == list.length - 1 }" hover-class="hover" :key="li.name">
				<view class="left">
					<view class="icons">
						<image :src="li.icon"></image>
					</view>
					<view class="text">{{ li.name }}</view>
				</view>
				<text class="yzb yzb-next icon-next"></text>
			</view>
		</view>
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog type="warn" cancelText="关闭" :confirmText="confirmText" title="温馨提示"
				:content="dialogContent" @confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
		</uni-popup>
		<float-popup-dialog :isShow="showMenuPop" :top="100" :right="5" :list="popList"
			@onClickPopBk="showMenuPop = false" @onClickPopupItem="onClickPopMenu"></float-popup-dialog>
		<!-- <page-tabpars></page-tabpars> -->
		<!-- <drag-button :isDock="true" :existTabBar="true" :type="1" @btnClick="toSign" /> -->
	</view>
</template>
<script>
	import {
		mapState,
		mapMutations,
		mapGetters
	} from 'vuex';
	import {
		formatDate
	} from '@/common/date';
	export default {
		computed: {
			...mapState(['userInfo', 'permission']),
			...mapGetters(['hasLogin'])
		},
		data() {
			return {
				showMenuPop: false,
				popList: [],
				scrollTop: 0,

				confirmText: "去绑定",
				dialogContent: '未绑定手机号,绑定体验更多精彩~',
				dialogType: 1, //1-绑定手机号，2-切换角色
				expectRole: null, //切换目标角色

				authState: '待认证',
				gridList: [{
						text: '我的简历',
						icon: 'yzb-xialingyingicon-11',
						to: this.$mRoutesConfig.personReume
					},
					{
						text: '投递反馈',
						icon: 'yzb-xinfeng',
						to: this.$mRoutesConfig.process
					},
					{
						text: '已沟通过',
						icon: 'yzb-goutong1',
						to: this.$mRoutesConfig.connected,
					},
					{
						text: '我的收藏',
						icon: 'yzb-shoucang1',
						to: this.$mRoutesConfig.collect
					}
				],
				gridList2: [{
						text: '公司主页',
						icon: 'yzb-gongsi',
						to: this.$mRoutesConfig.companyDetail,
						enter: true
					},
					{
						text: '简历管理',
						icon: 'yzb-xinfeng',
						to: this.$mRoutesConfig.resumeManage,
						// badge: '3',
						type: 'error',
						enter: true
					},
					{
						text: '已沟通过',
						icon: 'yzb-goutong1',
						to: this.$mRoutesConfig.connected,
						// badge: '1',
						type: 'error',
						enter: true
					},
					{
						text: '我的收藏',
						icon: 'yzb-shoucang1',
						to: this.$mRoutesConfig.collect,
						enter: true
					}
				],
				severList: [
					[{
							name: '附件简历',
							show: true,
							icon: '/static/img/my/upload.png',
							url: this.$mRoutesConfig.resumeFile
						},
						{
							name: '我的积分',
							show: true,
							icon: '/static/img/my/money.png',
							url: this.$mRoutesConfig.integral
						},
						{
							name: '积分道具',
							show: true,
							icon: '/static/img/my/zixun.png',
							url: this.$mRoutesConfig.integralGoods
						},
						// {
						// 	name: '我的名片',
						// 	show: true,
						// 	icon: '/static/img/my/card.png',
						// 	url: this.$mRoutesConfig.cardDetail
						// },
						{
							name: '我的签到',
							show: true,
							icon: '/static/img/my/sign.png',
							url: this.$mRoutesConfig.sign
						},
						// {
						// 	name: '咨询订单',
						// 	show: true,
						// 	icon: '/static/img/my/list.png',
						// 	url: this.$mRoutesConfig.planOrder
						// },
						{
							name: '分享有礼',
							show: true,
							icon: '/static/img/my/share.png',
							url: this.$mRoutesConfig.promotion
						},
						{
							name: '我的钱包',
							show: true,
							icon: '/static/img/my/qianbao.png',
							url: this.$mRoutesConfig.wallet
						},
						// {
						// 	name: '我的分享',
						// 	icon: '/static/img/my/share.png',
						// 	url: this.$mRoutesConfig.share
						// },
						{
							name: '浏览记录',
							show: true,
							icon: '/static/img/my/zixun.png',
							url: this.$mRoutesConfig.browse
						},
						{
							name: '隐私设置',
							show: true,
							icon: '/static/img/my/faxian.png',
							url: this.$mRoutesConfig.hideSetting
						},
						{
							name: '不感兴趣',
							show: true,
							icon: '/static/img/my/faxian.png',
							url: this.$mRoutesConfig.hideSetting
						},
						{
							name: '我要招聘',
							show: true,
							icon: '/static/img/my/switch.png',
							url: this.$mRoutesConfig.switchRole
						}
					],
					[{
							name: '客服中心',
							show: true,
							icon: '/static/img/my/contactus.png',
							url: this.$mRoutesConfig.contactUs
						},
						{
							name: '关于我们',
							show: true,
							icon: '/static/img/my/aboutus.png',
							url: this.$mRoutesConfig.aboutUs
						},
						// {
						// 	name: '帮助中心',
						// 	show: true,
						// 	icon: 'yzb-bangzhu1',
						// 	url: null
						// },
						// {
						// 	name: '意见反馈',
						// 	show: true,
						// 	icon: '/static/img/my/help.png',
						// 	url: this.$mRoutesConfig.feedBack
						// },
						{
							name: '系统设置',
							show: true,
							icon: '/static/img/my/setting.png',
							url: this.$mRoutesConfig.system
						}
					]
				],
				severList2: [
					[{
							name: '公司认证',
							show: true,
							auth: false,
							icon: '/static/img/my/auth.png',
							url: this.$mRoutesConfig.companyAuth
						},
						{
							name: '公司管理',
							show: true,
							auth: false,
							icon: '/static/img/my/company.png',
							url: this.$mRoutesConfig.company
						},
						{
							name: '职位管理',
							show: true,
							auth: true,
							icon: '/static/img/my/yijian.png',
							url: this.$mRoutesConfig.positions
						},
						{
							name: '招聘人员',
							show: true,
							auth: true,
							icon: '/static/img/my/aboutus.png',
							url: this.$mRoutesConfig.recruiter
						},
						{
							name: '我要求职',
							show: true,
							icon: '/static/img/my/switch.png',
							url: this.$mRoutesConfig.switchRole
						}
						// {
						// 	name: '我的积分',
						// 	show: true,
						// 	icon: '/static/img/my/money.png',
						// 	url: this.$mRoutesConfig.integral
						// },
						// {
						// 	name: '积分道具',
						// 	show: true,
						// 	icon: '/static/img/my/zixun.png',
						// 	url: this.$mRoutesConfig.integralGoods
						// },
						// {
						// 	name: '我的名片',
						// 	show: true,
						// 	icon: '/static/img/my/card.png',
						// 	url: this.$mRoutesConfig.cardDetail
						// },
						// {
						// 	name: '我的签到',
						// 	show: true,
						// 	icon: '/static/img/my/sign.png',
						// 	url: this.$mRoutesConfig.sign
						// },
						// {
						// 	name: '分享有礼',
						// 	show: true,
						// 	icon: '/static/img/my/share.png',
						// 	url: this.$mRoutesConfig.promotion
						// },
						// { name: '外包管理', show: true, auth:true, icon: '/static/img/my/list.png', url: this.$mRoutesConfig.tasks },
					],
					[{
							name: '客服中心',
							show: true,
							icon: '/static/img/my/contactus.png',
							url: this.$mRoutesConfig.contactUs
						},
						{
							name: '关于我们',
							show: true,
							icon: '/static/img/my/aboutus.png',
							url: this.$mRoutesConfig.aboutUs
						},
						// { name: '联系我们', show: true, icon: '/static/img/my/contactus.png', url: this.$mRoutesConfig.contactUs },
						// { name: '帮助中心', show: true, icon: 'yzb-bangzhu1',url: null },
						// {
						// 	name: '意见反馈',
						// 	show: true,
						// 	icon: '/static/img/my/help.png',
						// 	url: this.$mRoutesConfig.feedBack
						// },
						{
							name: '系统设置',
							show: true,
							icon: '/static/img/my/setting.png',
							url: this.$mRoutesConfig.system
						}
					]
				],
				severList3: [
					[{
							name: '资料认证',
							show: true,
							icon: '/static/img/my/auth.png',
							url: this.$mRoutesConfig.planerAuth
						},
						// {
						// 	name: '咨询订单',
						// 	show: true,
						// 	icon: '/static/img/my/list.png',
						// 	url: this.$mRoutesConfig.planOrder
						// },
						{
							name: '我的积分',
							show: true,
							icon: '/static/img/my/money.png',
							url: this.$mRoutesConfig.integral
						},
						{
							name: '我的签到',
							show: true,
							icon: '/static/img/my/sign.png',
							url: this.$mRoutesConfig.sign
						},
						{
							name: '分享有礼',
							show: true,
							icon: '/static/img/my/share.png',
							url: this.$mRoutesConfig.promotion
						},
					],
					[{
							name: '客服中心',
							show: true,
							icon: '/static/img/my/contactus.png',
							url: this.$mRoutesConfig.contactUs
						},
						{
							name: '关于我们',
							show: true,
							icon: '/static/img/my/aboutus.png',
							url: this.$mRoutesConfig.aboutUs
						},
						{
							name: '系统设置',
							show: true,
							icon: '/static/img/my/setting.png',
							url: this.$mRoutesConfig.system
						}
					]
				],
				severList4: [
					[{
							name: '我的子女',
							show: true,
							icon: '/static/img/my/auth.png',
							url: this.$mRoutesConfig.children
						},
						// {
						// 	name: '我的内推',
						// 	show: true,
						// 	icon: '/static/img/my/list.png',
						// 	url: this.$mRoutesConfig.push
						// },
						{
							name: '我的积分',
							show: true,
							icon: '/static/img/my/money.png',
							url: this.$mRoutesConfig.integral
						},
						{
							name: '我的签到',
							show: true,
							icon: '/static/img/my/sign.png',
							url: this.$mRoutesConfig.sign
						},
						{
							name: '分享有礼',
							show: true,
							icon: '/static/img/my/share.png',
							url: this.$mRoutesConfig.promotion
						},
					],
					[{
							name: '客服中心',
							show: true,
							icon: '/static/img/my/contactus.png',
							url: this.$mRoutesConfig.contactUs
						},
						{
							name: '关于我们',
							show: true,
							icon: '/static/img/my/aboutus.png',
							url: this.$mRoutesConfig.aboutUs
						},
						{
							name: '系统设置',
							show: true,
							icon: '/static/img/my/setting.png',
							url: this.$mRoutesConfig.system
						}
					]
				],
				severList5: [
					[{
							name: '我的学生',
							show: true,
							icon: '/static/img/my/auth.png',
							url: this.$mRoutesConfig.system
						},
						{
							name: '我的内推',
							show: true,
							icon: '/static/img/my/list.png',
							url: this.$mRoutesConfig.push
						},
						{
							name: '我的积分',
							show: true,
							icon: '/static/img/my/money.png',
							url: this.$mRoutesConfig.integral
						},
						{
							name: '我的签到',
							show: true,
							icon: '/static/img/my/sign.png',
							url: this.$mRoutesConfig.sign
						},
						{
							name: '分享有礼',
							show: true,
							icon: '/static/img/my/share.png',
							url: this.$mRoutesConfig.promotion
						},
					],
					[{
							name: '客服中心',
							show: true,
							icon: '/static/img/my/contactus.png',
							url: this.$mRoutesConfig.robot
						},
						{
							name: '关于我们',
							show: true,
							icon: '/static/img/my/aboutus.png',
							url: this.$mRoutesConfig.aboutUs
						},
						{
							name: '系统设置',
							show: true,
							icon: '/static/img/my/setting.png',
							url: this.$mRoutesConfig.system
						}
					]
				],
			};
		},

		onLoad() {
			// if(!this.hasLogin){
			// 	// #ifdef H5
			// 	this.$mRouter.push({
			// 		route: this.$mRoutesConfig.loginPwd,
			// 	})
			// 	return;
			// 	//  #endif
			// }
		},

		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},

		onShow() {
			if (this.hasLogin) {
				this.getUserInfo();
				// this.getAppRoles();
			}
		},
		methods: {

			//是否有指定的模块权限
			ifPermission(name) {
				if (!this.hasLogin || Array.isArray(this.permission) == false) {
					return false;
				}
				for (let item of this.permission) {
					if (item.path == "/pages/user/user") {
						let components = item.children;
						for (let cp of components) {
							if (cp.component == name) {
								return true;
							}
						}
					}
				}
				return false;
			},

			//获取用户菜单权限
			async getUserPermissionByToken() {
				let menus = await this.$apis.getUserPermissionByToken();
				console.log("menus============", menus)
				this.$store.commit('SET_TABBARS', menus.menu);
				this.$store.commit('SET_PERMISSION', menus.menu);
			},

			//移动端角色列表
			async getAppRoles() {
				let roles = await this.$apis.getAppRoles();
				console.log("getAppRoles============", roles)
				this.popList = roles;
			},

			// 获取用户信息
			async getUserInfo() {
				let userInfo = await this.$apis.getUserInfo();
				if (userInfo == true) {
					uni.clearStorageSync();
					this.$store.commit('SET_LOGOUT');
					if (this.goEasy.getConnectionStatus() === 'connected') {
						console.log('do  disconnect');
						getApp().globalData.imService.disconnect();
					}
					return;
				}
				if (!userInfo.phone) {
					this.dialogContent = "未绑定手机号,绑定体验更多精彩~";
					this.confirmText = "去绑定";
					this.dialogType = 1;
					this.$refs.alertDialog.open();
				} else {
					this.$refs.alertDialog.close();
				}
				this.$store.commit('SET_USERINFO', userInfo);
				if (userInfo.memberRole == "company") {
					if (!userInfo.companyId) {
						this.$mRouter.push({
							route: this.$mRoutesConfig.enter
						});
					} else {
						if (userInfo.companyAuth == 0) {
							this.authState = '待认证';
						} else if (userInfo.companyAuth == 1) {
							this.authState = '认证审核中';
						} else if (userInfo.companyAuth == 2) {
							this.authState = '认证失败';
						} else if (userInfo.companyAuth == 3) {
							this.authState = '已认证';
						}
					}
				} else if (userInfo.memberRole == "planer") {
					if (userInfo.companyAuth == 0) {
						this.authState = '待认证';
					} else if (userInfo.companyAuth == 1) {
						this.authState = '认证审核中';
					} else if (userInfo.companyAuth == 2) {
						this.authState = '认证失败';
					} else if (userInfo.companyAuth == 3) {
						this.authState = '已认证';
					}
				} else if (userInfo.memberRole == "member") {
					if (!userInfo.birthday) {
						this.$mRouter.push({
							route: this.$mRoutesConfig.userInfo
						});
					}
				} else if (userInfo.ifAddResume == false) {
					//暂无简历信息，强制添加
					// this.$mRouter.push({
					// 	route: this.$mRoutesConfig.userInfo
					// });
				}
			},

			//用户点击订单类型
			tapGrid(item) {
				console.log('tapGrid==', item);
				this.$mRouter.push({
					route: item.to,
					query: {
						id: 1
					}
				});
			},

			tapGrid2(item) {
				if (!this.userInfo.company) {
					uni.showToast({
						icon: 'none',
						title: '请先绑定公司'
					});
					return;
				}
				this.$mRouter.push({
					route: item.to,
					query: {
						id: 0
					}
				});
			},

			bindPhone() {
				this.$mRouter.push({
					route: this.$mRoutesConfig.bindPhone,
				});
			},

			toLogin() {
				if (this.hasLogin) {
					let route = this.$mRoutesConfig.myInfo;
					if (this.userInfo.memberRole == "member") {
						route = this.$mRoutesConfig.userInfo;
					}
					this.$mRouter.push({
						route: route
					});
				} else {
					this.$mRouter.push({
						//#ifdef MP-WEIXIN
						route: this.$mRoutesConfig.login,
						//#endif
						//#ifdef MP-TOUTIAO 
						route: this.$mRoutesConfig.login,
						//#endif
						//#ifdef H5
						route: this.$mRoutesConfig.loginPwd,
						//#endif
						//#ifdef APP-PLUS
						route: this.$mRoutesConfig.loginPwd,
						//#endif
						query: {
							id: 1
						}
					});
				}
			},


			toKefu() {
				// #ifdef  MP-WEIXIN
				wx.openCustomerServiceChat({
					extInfo: {
						url: 'https://work.weixin.qq.com/kfid/kfc5378e3143e746e42'
					},
					corpId: 'ww33cb15322fff0f54',
					success(res) {
						console.log("res===", res)
					},
					fail(err) {
						console.log("err===", err)
					}
				})
				// #endif
			},


			//用户点击列表项
			toPage(list_i, li_i) {
				let that = this;
				// if(this.severList[list_i][li_i].name=="客服中心"){
				// 	this.toKefu();
				// 	return;
				// }
				this.$mRouter.push({
					route: this.severList[list_i][li_i].url,
					query: {
						name: this.severList[list_i][li_i].name
					}
				});
			},

			//用户点击列表项
			toPage2(list_i, li_i) {
				let that = this;
				if (list_i == 0 && !this.userInfo.company) {
					uni.showToast({
						icon: 'none',
						title: '请先绑定公司'
					});
					return;
				}
				if (this.severList2[list_i][li_i].auth && this.userInfo.companyAuth != 3) {
					uni.showToast({
						icon: 'none',
						title: '公司未认证'
					});
					return;
				}

				if (this.severList2[list_i][li_i].name == "客服中心") {
					this.toKefu();
					return;
				}

				this.$mRouter.push({
					route: this.severList2[list_i][li_i].url,
					query: {}
				});
			},

			//用户点击列表项
			toPage3(list_i, li_i) {
				let that = this;
				if (this.severList3[list_i][li_i].name == "客服中心") {
					this.toKefu();
					return;
				}
				this.$mRouter.push({
					route: this.severList3[list_i][li_i].url,
					query: {
						name: this.severList3[list_i][li_i].name
					}
				});
			},

			toPage4(list_i, li_i) {
				let that = this;
				if (this.severList4[list_i][li_i].name == "客服中心") {
					this.toKefu();
					return;
				}
				this.$mRouter.push({
					route: this.severList4[list_i][li_i].url,
					query: {
						name: this.severList4[list_i][li_i].name
					}
				});
			},

			toPage5(list_i, li_i) {
				let that = this;
				this.$mRouter.push({
					route: this.severList5[list_i][li_i].url,
					query: {
						name: this.severList5[list_i][li_i].name
					}
				});
			},

			showRoles() {
				this.showMenuPop = true;
			},

			onClickPopMenu(val) {
				this.showMenuPop = false;
				if (this.userInfo.memberRole == val.code) {
					uni.showToast({
						icon: 'none',
						title: '当前已经是' + val.name + "角色！"
					})
					return;
				}
				console.log('onClickPopMenu', val);
				this.dialogContent = "确定切换到" + val.name + "角色？";
				this.confirmText = "确定";
				this.dialogType = 2;
				this.expectRole = val;
				this.$refs.alertDialog.open();
			},

			toResume() {
				this.$mRouter.push({
					route: this.$mRoutesConfig.personReume,
					query: {
						id: 1
					}
				});
			},

			hidePhone(phone) {
				return this.$mUtils.phoneHiden(phone);
			},

			dialogClose() {
				console.log('点击关闭')
			},
			dialogConfirm(val) {
				console.log("dialogConfirm", val);
				this.$refs.alertDialog.close();
				if (this.dialogType == 1) {
					this.$mRouter.push({
						route: this.$mRoutesConfig.bindPhone,
					});
				} else { //角色切换
					this.switchRole();
				}
			},

			//角色切换
			async switchRole() {
				let res = await this.$apis.switchRole({
					role: this.expectRole.code,
				});
				console.log("==switchRole==", res);
				this.getUserInfo();
				this.getUserPermissionByToken();
				console.log('res======', res);
				if (res.result) {
					uni.showToast({
						icon: 'none',
						title: '切换成功'
					});
				}
				if (res.role == "member" && res.info == false) { //学生无基本信息
					console.log('填写基本信息');
					//跳转到简历编辑页面。
					this.$mRouter.push({
						route: this.$mRoutesConfig.userInfo,
						query: {
							id: 1
						}
					});
				} else if (res.role == "company" && res.info == false) {
					this.$mRouter.push({
						route: this.$mRoutesConfig.enter
					});
				}
			},

			toVip() {
				this.$mRouter.push({
					route: this.$mRoutesConfig.vip,
				});
			},

			toSign() {
				this.$mRouter.push({
					route: this.$mRoutesConfig.sign,
				});
			},

			formatCreateTime(time) {
				if (time == null || time === '') {
					return null;
				}
				let str = time.replace(/-/g, '/');
				let date = new Date(str);
				return formatDate(date, 'yyyy-MM-dd');
			},
		}
	};
</script>

<style lang="scss">
	page {
		background-color: #f8f8f8;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-bottom: 30upx;
	}

	.header {
		// background-color: #12ae85;
		width: 100%;
		/* #ifdef H5 || MP-TOUTIAO */
		height: 380upx;
		/* #endif */
		/* #ifndef H5 || MP-TOUTIAO */
		height: 420upx;
		/* #endif */
		display: flex;
		align-items: center;
		// justify-content: flex-end;
		flex-direction: column;
		margin-bottom: 20upx;
		position: relative;

		.bg {
			width: 100%;
			/* #ifdef H5 || MP-TOUTIAO */
			height: 380upx;
			/* #endif */
			/* #ifndef H5 || MP-TOUTIAO */
			height: 420upx;
			/* #endif */
			position: absolute;
			top: 0;
			left: 0;
			z-index: 0;
		}

		&.status {
			padding-top: var(--status-bar-height);
		}

		.header-info {
			display: flex;
			align-items: center;
			width: 92%;
			/* #ifdef H5 || MP-TOUTIAO */
			margin-top: 80upx;
			/* #endif */
			/* #ifndef H5 || MP-TOUTIAO */
			margin-top: 120upx;
			/* #endif */

		}

		.userinfo {
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			z-index: 10;
			margin-bottom: 20upx;

			.info-top {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
			}

			.face {
				image {
					width: 150upx;
					height: 150upx;
					border-radius: 75upx;
				}
			}

			.info-row {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
			}

			.info-column {
				display: flex;
				flex-direction: column;
				// align-items: center;
			}

			.info {
				width: 100%;
				padding-left: 30upx;
				margin-top: -15upx;

				.username {
					width: 100%;
					color: #000;
					font-size: 40upx;
					margin-left: 10upx;
				}

				.integral {
					align-items: center;
					padding: 8upx 20upx;
					color: #333;
					background-color: rgba(0, 0, 0, 0.1);
					border-radius: 20upx;
					font-size: 24upx;
				}

				.percent {
					margin-left: 10upx;
					align-items: center;
					padding: 8upx 20upx;
					background-color: #FCF0F0;
					color: #B05062;
					border-radius: 20upx;
					font-size: 24upx;
				}
			}
		}

		.role {
			flex-shrink: 0;
			z-index: 10;

			text {
				font-size: 30upx;
				color: #333;
			}

			.role-name {
				font-size: 30upx;
				color: #FF822B;
				font-weight: bold;
			}
		}

		.vip {
			/* #ifdef H5 */
			bottom: 35upx;
			/* #endif */
			/* #ifndef H5 */
			bottom: 20upx;
			/* #endif */
			position: absolute;
			z-index: 10;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			width: 88%;

			.vip-left {
				display: flex;
				flex-direction: column;
				// width: 100%; 

				.vip-info {
					display: flex;
					align-items: center;
					flex-direction: row;
					justify-content: center;
					width: 100%;

					image {
						width: 40upx;
						height: 40upx;
					}

					.info1 {
						margin-left: 10upx;
						color: #FFE8BA;
						font-size: 34upx;
					}

					.info2 {
						margin-left: 20upx;
						color: #BCA583;
						font-size: 32upx;
					}
				}

				.tips {
					font-size: 26upx;
					color: #786855;
					margin-top: -7upx;
				}
			}

			.vip-right {
				text {
					background-color: #FFE8BA;
					color: #333;
					padding: 10upx 15upx;
					border-radius: 10upx;
					font-size: 28upx;
				}
			}

			.vip-right2 {
				text {
					color: #9F8E6D;
					padding: 10upx 15upx;
					border-radius: 10upx;
					font-size: 28upx;
				}
			}
		}
	}

	.hover {
		background-color: #eee;
	}

	.w-list {
		// margin-top: 20upx;
		width: 96%;
		margin-bottom: 20upx;
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: #ffffff;
		border-radius: 20upx;

		.title {
			color: #000;
			font-size: 34upx;
			font-weight: bold;
			padding: 20upx 20upx 0upx 20upx;
			margin-bottom: -20upx;
		}

		.grid {
			margin-bottom: 6upx;
			margin-top: 30upx;
			width: 100%;
			// border-radius: 24upx;
			// box-shadow: 0 0 20upx rgba(0, 0, 0, 0.15);
			display: flex;
			flex-direction: row;

			.item {
				display: flex;
				flex-direction: column;
				align-items: center;
				width: 25%;
			}

			.icon {
				// height: 95upx;
			}

			.grid-dot {
				position: absolute;
				top: 5upx;
				right: 15upx;
			}

			.grid-icon {
				color: $main-color;
				font-size: 60upx;
				line-height: 100upx;
				// width: 60upx;
				// height: 60upx;
				// margin-bottom: 10upx;
			}

			.grid-icon2 {
				width: 60upx;
				height: 60upx;
			}
		}

		.uni-grid .text {
			font-size: 28rpx;
			height: 25upx;
			line-height: 25upx;
			color: #333;
		}

		.uni-grid .item ::v-deep .uni-grid-item__box {
			justify-content: center;
			align-items: center;
			width: 25%;
		}
	}

	.list {
		width: 96%;
		background-color: #fff;
		border-radius: 20upx;
		display: flex;
		flex-direction: column;
		margin-bottom: 20upx;

		.title {
			color: #000;
			font-size: 34upx;
			font-weight: bold;
			padding: 20upx;
			margin-bottom: -10upx;
		}

		.li {
			width: 92%;
			height: 90upx;
			padding: 0 4%;
			border-bottom: solid 1upx #ebeef5;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;

			&.noborder {
				border-bottom: 0;
			}

			.left {
				display: flex;
				flex-direction: row;
				align-items: center;
			}

			.right {
				display: flex;
				flex-direction: row;
				align-items: center;
			}

			.icons {
				display: flex;
				align-items: center;
				margin-right: 20upx;
				align-items: center;

				text {
					font-size: 40upx;
				}

				image {
					width: 45upx;
					height: 45upx;
				}
			}

			.text {
				width: 100%;
				color: #333;
				font-size: 30upx;
			}

			.to {
				flex-shrink: 0;
				width: 40upx;
				height: 40upx;
			}

			.auth-result {
				min-width: 200upx;
				text-align: right;
				margin-right: 10upx;
				color: $main-color;
				// font-weight: bold;
			}

			.auth-success {
				color: $uni-color-success;
			}

			.icon-next {
				font-size: $font-size-34;
				color: $font-color-999;
			}
		}
	}

	.btn {
		text-align: center;
		border-radius: 20rpx;
		margin-top: 50upx;
		height: 70upx;
		line-height: 70upx;
		font-size: 32rpx;
		width: 90%;
		background-color: #f8f8f8;
		color: #12ae85;
		border: 1upx solid #12ae85;
	}
</style>